<template>
  <basic-container>
    <filling-stations-list
      ref="listRef"
      v-show="showType === 'list'"
      :siteTypeList="siteTypeList"
      @add="handleAdd"
      @edit="handleEdit"
      @view="handleView"
    />
    <filling-station-add-edit-content
      v-if="showType === 'addOrEdit'"
      :id="siteId"
      :type="type"
      :siteTypeList="siteTypeList"
      @back="back"
    />
  </basic-container>
</template>

<script>
import { isTrue } from "@/util/common-util";
import { getSiteType } from "@/api/stake/filling-stations";
import fillingStationsList from "@/views/stake/filling-stations-list.vue";
import fillingStationAddEditContent from "@/views/stake/filling-station-add-edit-content.vue";
export default {
  data() {
    return {
      showType: "list",
      siteTypeList: [],
      siteId: "",
      type: "",
    };
  },
  components: {
    fillingStationsList,
    fillingStationAddEditContent,
  },
  computed: {},
  mounted() {
    this.initSiteTypes();
  },
  methods: {
    initSiteTypes() {
      getSiteType().then((res) => {
        this.siteTypeList = res.data.data;
      });
    },
    handleAdd() {
      this.type = "add";
      this.showType = "addOrEdit";
    },
    handleEdit(_id) {
      this.siteId = _id;
      this.type = "edit";
      this.showType = "addOrEdit";
    },
    handleView(_id) {
      this.siteId = _id;
      this.type = "view";
      this.showType = "addOrEdit";
    },
    back(flag) {
      this.showType = "list";
      if (flag) this.$refs.listRef.refresh();
    },
  },
};
</script>

<style></style>
